<!DOCTYPE html>

<html>

<head>

    <meta charset="UTF-8">
    <title>Bad Form, Peter</title>
    <style>
        body { font-family: mono; }
        form { margin: 0 auto; }
        form div { margin-bottom: 10px; }
    </style>

</head>

<body>

<div style="display: none;">
    <p>Please mind the following:</p>
    <ul id="prompts"></ul>
</div>

<form id="lomake" method="post" action="./">

    <div>
        <label for="user">User: </label>
        <input type="text" id="user" name="user" value="" required />
    </div>
    <div>
        <label for="pass">Pass: </label>
        <input type="password" id="pass" name="pass" value="" required />
    </div>
    <div>
        <label for="submit">Please only submit the form once.</label>
        <br>
        <button type="submit" id="submit" name="button" value="thanks">Submit</button> 
    </div>
     
</form>

<script src="main.js"></script>
<script>
    window.onload = function () {
        var pan = new BadFormPeter();
        pan.onload("lomake", "submit", "prompts");
    };
</script>

</body>

</html>

